<template>
  <div class="dashboard-editor-container">

    <panel-group/>
<!--    <el-row style="background:#fff;padding:16px 16px 0;margin-bottom:32px;">-->
<!--      <bar-chart :chart-data="barCharData" />-->
<!--    </el-row>-->
    <el-row style="background:#fff;padding:16px 16px 0;margin-bottom:32px;">
      <div>每日抓取数据量(企业详情)：</div>
      <stacked-horizontal-bar-chart :chart-data="stackBarCharData" />
    </el-row>
  </div>
</template>

<script>
  import PanelGroup from './admin/components/PanelGroup'
  import BarChart from './admin/components/BarChart'
  import StackedHorizontalBarChart from './admin/components/StackedHorizontalBarChart'
  import {everyDataCountApi} from "@/api/dashboard";


  export default {
    name: 'DashboardAdmin',
    components: {
      StackedHorizontalBarChart,
      PanelGroup,
      BarChart,
    },
    mounted() {
      this.getBarCharFun()
    },
    data() {
      return {
        barCharData: {
          x_data:["A", "B"],
          y_data:["120", "110"]
        },
        stackBarCharData: {
          y_data: ['2023-7-18', '2023-7-19'],
          x_data: {
            sq: [10,10,10],
            hy:[6,7,8]
          }
        },
      }
    },
    methods: {
      getBarCharFun(){
        everyDataCountApi({}).then(res=>{
          this.stackBarCharData.y_data = res.result.y_data;
          this.stackBarCharData.x_data = res.result.x_data;
          this.barCharData.y_data = [160, 180]
        })
      }
    }
  }
</script>

<style lang="scss" scoped>
  .dashboard-editor-container {
    padding: 32px;
    background-color: rgb(240, 242, 245);
    position: relative;

    .github-corner {
      position: absolute;
      top: 0px;
      border: 0;
      right: 0;
    }

    .chart-wrapper {
      background: #fff;
      padding: 16px 16px 0;
      margin-bottom: 32px;
    }
  }

  @media (max-width:1024px) {
    .chart-wrapper {
      padding: 8px;
    }
  }
</style>
